<template>
	<view class="page-wrap">
		<view class="title">
			使用指南
		</view>
		<view class="guide-content">
			<view class="guide-left">
				
			</view>
			<view class="guide-right">
				<view class="flow-path-row">
					<view class="flow-path-title">
						<view class="flow-path-title-icon"></view>
						<view class="flow-path-title-text">
							1.注册登录
						</view>
					</view>
					<view class="flow-path-content">
						经其法定代理人同意并由其法定代理人代理注册及应用美团网服务
					</view>
				</view>
				<view class="flow-path-row">
					<view class="flow-path-title">
						<view class="flow-path-title-icon"></view>
						<view class="flow-path-title-text">
							2.XX功能
						</view>
					</view>
					<view class="flow-path-content">
						经其法定代理人同意并由其法定代理人代理注册及应用美团网服务
					</view>
				</view>
				<view class="flow-path-row">
					<view class="flow-path-title">
						<view class="flow-path-title-icon"></view>
						<view class="flow-path-title-text">
							3.XX功能
						</view>
					</view>
					<view class="flow-path-content">
						经其法定代理人同意并由其法定代理人代理注册及应用美团网服务
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			};
		}
	}
</script>

<style lang="scss">
page {
	height: 100%;
}
.page-wrap {
	padding: 0 48rpx;
	border-top: 2rpx solid #F6F7F9;
	min-height: 100%;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
}
.title {
	font-size: 36rpx;
	font-family: PingFang SC, PingFang SC;
	font-weight: bold;
	color: #333333;
	padding: 48rpx 0;
}
.guide-content {
	display: flex;
	justify-content: space-between;
	flex: 1;
	position: relative;
	.guide-left {
		height: 100%;
		width: 2rpx;
		background: #F6F7F9;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		opacity: 1;
		position: absolute;
		top: 0%;
		left: 26rpx;
		bottom: 0;
	}
	.guide-right {
		flex: 1;
		margin-left: 72rpx;
	}
	.flow-path-row {
		margin-top: 48rpx;
		.flow-path-title {
			position: relative;
			font-size: 28rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: bold;
			color: rgba(0,0,0,0.8);
			.flow-path-title-icon {
				position: absolute;
				width: 24rpx;
				height: 24rpx;
				background: #FFFFFF;
				opacity: 1;
				border: 2rpx solid #EE5953;
				border-radius: 50%;
				top: 50%;
				left: -58rpx;
				transform: translateY(-50%);
				z-index: 1;
			}
		}
		.flow-path-content {
			font-size: 24rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			color: rgba(0,0,0,0.8);
			margin-top: 16rpx;
		}
	}
}
</style>
